import React from "react";
import _ from "lodash";
import { Table, Button, message } from "antd";
import { columns } from "./config";
import { Axios } from "../../config";

import styles from "./style.module.css";

const TodoTable = ({ dataSource = [], handleSearch }) => {
    const handleCompleteOrCancel = (id, status) => {
        Axios.patch(`/update/${id}`, {
            status,
        })
            .then((res) => {
                if (
                    _.get(res, "status") === 200 &&
                    _.get(res, "data.code") === 20000
                ) {
                    message.success(_.get(res, "data.msg"));
                    Axios.get("/list")
                        .then((res) => {
                            if (
                                _.get(res, "status") === 200 &&
                                _.get(res, "data.code") === 20000
                            ) {
                                handleSearch(_.get(res, "data.data.list", []));
                            }
                        })
                        .catch((err) => {
                            message.error(
                                `服务器异常：${err.message}，请稍后重试……`
                            );
                        });
                }
            })
            .catch((err) => {
                message.error(`服务器异常：${err.message}，请稍后重试……`);
            });
    };

    return (
        <div className={styles.tableBox}>
            <Button type={"primary"}>新增</Button>
            <Table
                columns={columns({
                    handleCompleteOrCancel,
                })}
                dataSource={dataSource}
            />
        </div>
    );
};

export default TodoTable;
